<%@ page pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html lang="en">
<head>
  <title>供应商供货分析图</title>
</head>

<body>
   
    
</body>
<canvas id="myChart" height="10" width="40"></canvas>
<canvas id="myCharta" height="15" width="60"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script>
    var ctx = document.getElementById('myChart').getContext('2d');

    var chart= new Chart(ctx, {
        //要创建的图表类型
        type: 'radar',
        //数据集
        data:{
            labels:["运输时间","供应数量","供应价格","供应质量","服务态度"],
            datasets:[{
                label:"供应商供货分析雷达图",
               // backgroundColor:'#265a88',
                borderColor:'#265a88',
                data:[30,25,23,15,10],
            }]
        },
        // 配置项
        options: {}
    });


</script>
<script>
    var ctx = document.getElementById('myCharta').getContext('2d');

    var chart= new Chart(ctx, {
        //要创建的图表类型
        type: 'bar',
        //数据集
        data:{
            labels:["运输时间","供应数量","供应价格","供应质量","服务态度","0"],
            datasets:[{
                label:"供应商供货分析柱形图",
                backgroundColor:'#265a88',
                borderColor:'#265a88',
                data:[30,25,23,15,10,0],
            }]
        },
        // 配置项
        options: {}
    });


</script>

</html>